<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8"/>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"/>
		<meta name="HandheldFriendly" content="true"/>
		<meta name="MobileOptimized" content="320"/>
		<title>titleNView</title>
		<script type="text/javascript" src="../js/common.js"></script>
		<script type="text/javascript">
var ws = null;
// H5 plus事件处理
function plusReady(){
	ws = plus.webview.currentWebview();
}
document.addEventListener('plusready', plusReady, false);
// 自定义按钮
var bButton = false;
function setButtons(){
	ws.setStyle({
		titleNView: {
			'padding-right': '10px',
			buttons:[{
				type: 'favorite',
				redDot: true
			},{
				text: '分享',
				fontSize: '16px',
				width: 'auto'
			},{
				'float': 'left',
				text: '测试',
				fontSize: '16px',
				select: true,
				width: 'auto',
				onclick: onClickedButton
			}]
		}
	});
	bButton = true;
}
// 按钮点击事件
function onClickedButton(){
	plus.nativeUI.toast('点击了测试按钮');
}
// 设置红点
function showRedDot(){
	if(!bButton){
		plus.nativeUI.toast('标题栏未设置自定义按钮');
	}
	ws.showTitleNViewButtonRedDot({index:0});
}
// 隐藏红点
function hideRedDot(){
	if(!bButton){
		plus.nativeUI.toast('标题栏未设置自定义按钮');
	}
	ws.hideTitleNViewButtonRedDot({index:0});
}
// 设置角标
function setBadge(){
	if(!bButton){
		plus.nativeUI.toast('标题栏未设置自定义按钮');
	}
	ws.setTitleNViewButtonBadge({index:0,text:'9'});
}
// 移除角标
function removeBadge(){
	if(!bButton){
		plus.nativeUI.toast('标题栏未设置自定义按钮');
	}
	ws.removeTitleNViewButtonBadge({index:0});
}
// 隐藏/显示按钮
var bShow = true;
function switchButton(){
	bShow = !bShow;
	ws.setTitleNViewButtonStyle(1, {width:(bShow?'auto':'0px')})
}
		</script>
		<link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8"/>
	</head>
	<body>
		<br/><br/>
		<span class="des">向上滚动显示标题栏</span>
		<br/><br/>
		<div class="button" onclick="setButtons()">标题栏自定义按钮</div>
		<div class="button" onclick="showRedDot()">显示红点</div>
		<div class="button" onclick="hideRedDot()">隐藏红点</div>
		<div class="button" onclick="setBadge()">设置角标</div>
		<div class="button" onclick="removeBadge()">移除角标</div>
		<br/>
		<div class="button" onclick="switchButton()">隐藏/显示按钮</div>
		<br/>
		<div style="width:100%;height:1000px"></div>
	</body>
</html>